<include file="Public/mobile_head"/>
<include file="./Addons/Shop/View/default/Index/base.html" />
<body class="cate">
<header style="background-color:#{$shop_config.color}">
  <section id="title"><a href="javascript:history.back()"><span class="topback"></span></a>我的订单</section>
</header>
<!--底部导航-->
<include file="./Addons/Shop/View/default/Index/footer.html" />
<style>
    .grade{
        clear:both;
    }
    .grade img{
        width: 25px;
        display:inline;
        margin-top:5px;
    }
</style>

<script src="{:ADDON_PUBLIC_PATH}/js/jquery.js"></script>
<script src="{:ADDON_PUBLIC_PATH}/js/comm.js"></script>
<script src="{:ADDON_PUBLIC_PATH}/js/swiper.js"></script>
<section id="" class="mb10 mt10">
    <div class="order_panel p10 mb10">
          <div class="myorder-info_top pr pb10 mb10">
              <span class="fl mr10">订单号：{$order.ordernum}</span> <span class="fl">下单时间：{$order.cTime|date="Y-m-d H:i:s",###}</span>
          </div>
          <form action="{:addons_url('Shop://Index/submitcomment')}" id="commentForm" method="post">
          <div class="order_list">
          	<input name="oid" id="oid" type="hidden" value="{$order.id}"/>
          	<!-- <input name="num" id="num" type="hidden" value="{:count($order['detail'])}"/> -->
            <ul>
              <volist name='order.detail' id='vo_detail'>
              	<input name="pids[]" id="{$vo_detail.p_id}_pids" type="hidden" value="{$vo_detail.p_id}"/>
                <a href="#">
                    <li> <a href="<neq name='vo.can_use' value='0'>{:addons_url('Shop://Index/productinfo')}&id={$vo_detail.p_id}</else>#</neq>"><img src="{$vo_detail.head_img|get_cover_url}"></a><span class="order_title mt5">{$vo_detail.name}</span><span>￥{$vo_detail.true_price} × {$vo_detail.num} </span></li>
                </a> 
                <!--START 每个商品的评价表单 -->
                <div style="clear:both;line-height:40px;">
                    <span class="fl" style="width:60px; color:#999;padding-left:5px;">商品评分：</span>
                    <span class="grade">
                    	<img id="{$vo_detail.p_id}_p_1" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">&nbsp;
                    	<img id="{$vo_detail.p_id}_p_2" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">&nbsp;
                    	<img id="{$vo_detail.p_id}_p_3" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">&nbsp;
                    	<img id="{$vo_detail.p_id}_p_4" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">&nbsp;
                    	<img id="{$vo_detail.p_id}_p_5" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">
                    </span>
                    <span class="fl" id="{$vo_detail.p_id}_p_msg" style="width:35px; color:red;padding-left:5px;font-weight:bold;font-size:15px;">评分</span>
                	<input name="{$vo_detail.p_id}_p_grade" id="{$vo_detail.p_id}_p_grade" type="hidden" value="0"/>
                </div>                
                <div style="clear:both;line-height:40px;">
                    <span class="fl" style="width:60px; color:#999;padding-left:5px;">服务评分：</span>
                    <span class="grade">
                    	<img id="{$vo_detail.p_id}_s_1" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">&nbsp;
                    	<img id="{$vo_detail.p_id}_s_2" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">&nbsp;
                    	<img id="{$vo_detail.p_id}_s_3" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">&nbsp;
                    	<img id="{$vo_detail.p_id}_s_4" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">&nbsp;
                    	<img id="{$vo_detail.p_id}_s_5" alt="" src="{:ADDON_PUBLIC_PATH}/images/star-on.png">
                    </span>
                    <span class="fl" id="{$vo_detail.p_id}_s_msg" style="width:35px; color:red;padding-left:5px;font-weight:bold;font-size:15px;">评分</span>
                	<input name="{$vo_detail.p_id}_s_grade" id="{$vo_detail.p_id}_s_grade" type="hidden" value="0"/>
                </div>

                <div style="clear:both;line-height:40px;">
                    <span class="fl" style="width:60px; color:#999;padding-left:5px;display:inline;">买家评价：</span>
                    <input type="text" name="{$vo_detail.p_id}_remarks" id="{$vo_detail.p_id}_remarks" style="display:inline;" placeholder="请输入商品评语">
                </div>
                  <div style="clear:both;"></div>
                <!--END  -->
              </volist>
            </ul>

            <!--<div class="myorder-info_bottom"><span class="fl" style="width:40px; color:#999; padding-left:5px;">送至</span> <span class="fl mr10">{$order.name}</span><span class="fl">{$order.phone}</span> <span class="fl" style="padding-left:45px; font-style:11px; color:#999; width:-webkit-calc(100% - 55px); line-height:20px; padding-bottom:10px;">{$order.province} {$order.city} <neq name='vo.area' value='null'>{$order.area}</neq> {$vo.address}</span>
                <div style="clear:both;"></div>
            </div>
            <div style="clear:both;"></div>-->
            <!--<notempty name="order.wuliu_gongsi">
                <div class="order_list"><span class="fl" style="width:40px; color:#999; padding-left:5px;">物流</span> <span class="fl mr10">{$vo.wuliu_gongsi}</span><span class="fl">{$vo.wuliu_num}</span>
                 <p>{:getExpressInfo($vo.wuliu_num)}</p>
                 </div>
            </notempty>-->
            
            <!--备注行，无备注时不显示-->
            <notempty name='vo.remarks'>
            <div class="myorder-info_bottom"><span class="fl" style="width:40px; color:#999;padding-left:5px;">备注</span> <span class="fl mr10" style="width:-webkit-calc(100% - 55px); overflow:hidden; text-overflow:ellipsis;"><nobr>{$vo.remarks}</nobr></span></div>
            </notempty>
            <div class="myorder-info_bottom">
                <div class="fl order_status">总金额：<span class="cp">￥{$order.total_price} </span><span class="ml10"><if condition ="$vo.payType eq 1"><elseif condition="$vo.payType eq 3"/><br />货到付款订单</if></span></div>
                <div class="btn_bottom fr" style="background-color:#dc214c"><a href="###" id="sureorder">提交评价</a></div>
                <div style="clear:both;"></div>
            </div>
            <div style="clear:both;"></div>
          </div>
          </form>
        <br>
        <br>
        <br>
        </div>
</section>

</body>
<script>
$(function(){
	$('.grade').children("img").each(function(){
		$(this).attr('src',"{:ADDON_PUBLIC_PATH}/images/star-off.png");
	});
	$('.grade img').bind('click',function(){
		//alert($(this).attr('id'));
		
		var id = $(this).attr('id').split("_");
		var index = id[2];
		
		//循环
		for(var i=1 ; i<=5 ; i++){
			var t_id = id[0] + "_" + id[1] + "_" + i;
			if(i<=index){
				$("#"+t_id).attr('src',"{:ADDON_PUBLIC_PATH}/images/star-on.png")
			}else{
				$("#"+t_id).attr('src',"{:ADDON_PUBLIC_PATH}/images/star-off.png")
			}
		}
		var msg_id = id[0] + "_" + id[1] + "_msg";
		var val_id = id[0] + "_" + id[1] + "_grade";
		$("#"+msg_id).html(index+"分");
		$("#"+val_id).val(index);
	});
	
	$('#sureorder').bind('click',function(){
		if(confirm("您确认提交评价?")){
			commentForm.submit();
		}
	});
	
});

</script>
</html>